<!-- 验证码登录 -->
<template>
  <div>
    <van-nav-bar
      :z-index="999"
      :fixed="true"
      left-arrow
      @click-left="onClickLeft"
      :placeholder="true"
      title="密码登录"
    ></van-nav-bar>
    <!-- 输入框 -->
    <div class="authcode">
      <van-cell-group>
        <van-field
          @blur="phone"
          v-model="value"
          type="tel"
          placeholder="请输入账号或手机号"
        >
          <template #left-icon>
            <div>
              <img
                class="left-icon"
                src="../../../assets/images/shouji.png"
                alt
              />
            </div>
          </template>
        </van-field>
      </van-cell-group>

      <van-cell-group>
        <van-field
          @blur="code"
          v-model="password"
          type="password"
          placeholder="请输入密码"
        >
          <template #left-icon>
            <div>
              <img
                class="left-icon"
                src="../../../assets/images/shouji.png"
                alt
              />
            </div>
          </template>
        </van-field>
      </van-cell-group>
      <span class="phone_verify" v-show="regular">账号或密码不能为空</span>
      <!-- <span class="phone_verify" v-show="canonical"
        >手机号或密码格式不正确</span
      > -->
      <!-- <span class="verify_number" v-show="show">密码必须由数字、字母、特殊字符组合,请输入6-16位</span> -->
      <van-button
        @click="lognIn()"
        class="authcode-btn"
        :disabled="forbid"
        type="primary"
        block
        >登录</van-button
      >
      <!-- <div @click="lognIn()" class="authcode-btn">登录</div> -->
      <div class="authcode-state" @click="agreement">
        <img v-if="consent" src="../../../assets/images/67.png" alt />
        <img v-else src="../../../assets/images/68.png" alt />
        <span style="color:#c6c6c6;margin:auto 5px">同意</span>
        <span @click="href('/Contract')" style="color:#6AB6AB"
          >驾校通平台使用协议、隐私政策</span
        >
      </div>
      <!-- end -->
      <MoreWays></MoreWays>
    </div>
  </div>
</template>

<script>
import { Toast, Dialog } from "vant";
import MoreWays from "./MoreWays";
import { baseURL } from "../../../assets/js/config";
// import { postLogin } from "../../../assets/js/api/user";
export default {
  name: "AuthCode",
  data() {
    return {
      password: "",
      value: "",
      regular: false,
      // canonical: false,
      // show: false,
      // 是否同意勾选
      img1: true,
      img2: false,
      // 登录按钮状态
      forbid: false,
      consent: true
    };
  },

  methods: {
    agreement() {
      if (this.consent) {
        this.consent = false;
      } else {
        this.consent = true;
      }
    },

    onClickLeft() {
      this.$router.push({ path: "/Ucenter" });
    },
    // 手机号码验证
    phone() {
      if (this.value === "") {
        this.regular = true;
        return;
      } else {
        this.regular = false;
      }
      // if (!/^1[3-9]\d{9}$/.test(this.value)) {
      //   this.canonical = true;
      // } else {
      //   this.canonical = false;
      // }
    },
    // 密码验证
    code() {
      this.getCID();
      // this.show = false;
      if (this.password === "") {
        this.regular = true;
        return;
      }
    },
    lognIn() {
      let _this = this;
      if (_this.value == "") {
        Toast("请填写手机号");
        return;
      }
      if (_this.password == "") {
        Toast("请填写密码");
        return;
      }
      if (_this.consent) {
        Toast("请先同意协议");
        return;
      }
      // let dsBridge = require("dsbridge");
      // dsBridge.call("getCID", "", function(data) {
      //   let price = data;
      // Toast(_this.price);
      _this.axios
        .post(baseURL + "/login/usernameLogin", {
          username: _this.value,
          password: _this.password,
          data: 123456
        })
        .then(res => {
          // console.log(res);
          // console.log(res.data);
          if (res.data.code == 0) {
            localStorage.setItem("img", res.data.data.user.img);
            localStorage.setItem("userName", res.data.data.user.userName);
            localStorage.setItem("token", res.data.data.token.token);
            // console.log("data里的值：" + JSON.parse(res.data.msg).token);
            sessionStorage.setItem("token", res.data.data.token.token);
            _this.$router.push({ path: "/" });
            Toast.success("登陆成功");
          } else {
            Dialog.alert({
              message: `${res.data.msg}`
              // theme: "round-button"
            }).then(() => {
              // on close
            });
          }
        })
        .catch(err => {
          console.error(err);
        });
      // });
    },

    ShowIf() {
      if (this.img1) {
        this.img1 = false;
        this.img2 = true;
      } else if (!this.img1) {
        this.img1 = true;
        this.img2 = false;
      }
    },
    href(url) {
      this.$router.push({ path: url });
    }
  },
  components: { MoreWays, [Dialog.Component.name]: Dialog.Component },
  created() {
    let dsBridge = require("dsbridge");
    dsBridge.call("goBack", "", function() {
      history.go(-1);
    });
  }
};
</script>

<style></style>
